<template>
    <view>
        <cu-custom bgColor="bg-gradual-green" isBack="true">
            <block slot="content">物流信息</block>
            <block slot="backText">返回</block>
        </cu-custom>

        <form>
            <view class="cu-bar bg-white solid-bottom margin-top">
                <view class="action">
                    <text class="cuIcon-titles text-green"></text> 快递信息
                </view>
            </view>
            <view class="cu-form-group">
                <view class="title">快递公司</view>
                <view class="title">{{getNameFromCode(logistics.com)}}</view>
            </view>
            <view class="cu-form-group">
                <view class="title">快递单号</view>
                <view class="title">{{logistics.nu}}</view>
            </view>
            <view class="cu-form-group">
                <view class="title">快递单当前状态</view>
                <view class="title">{{states[logistics.state]}}</view>
            </view>

            <view class="cu-bar bg-white solid-bottom margin-top">
                <view class="action">
                    <text class="cuIcon-titles text-green"></text> 物流信息
                </view>
            </view>
            <view class="cu-timeline">
                <view v-for="(logi, index) in logistics.data" class="cu-item" v-bind:key="index">
                    <view class="content">
                        <view class="cu-capsule radius">
                            <view class="cu-tag bg-cyan">{{getDay(logi.ftime)}}</view>
                            <view class="cu-tag line-cyan">{{getTime(logi.ftime)}}</view>
                        </view>
                        <view class="margin-top">
                            {{logi.context}}
                        </view>
                    </view>
                </view>
            </view>
        </form>
    </view>
</template>

<script>
import code from './com_code2name.js';
import {LOGISTICS_API} from '../../../../API.js';
import md5 from 'js-md5';
export default {
    data() {
        return {
            logistics: {
                'message': 'ok',
                'state': '0', // 快递单当前状态
                'status': '200',
                'condition': 'F00',
                'ischeck': '0',
                'com': 'yuantong', // 快递公司编码
                'nu': 'V030344422', // 快递单号
                'data': [
                    {
                        'context': '上海分拨中心/装件入车扫描',
                        'time': '2012-08-28 16:33:19',
                        'ftime': '2012-08-28 16:33:19',
                    },
                    {
                        'context': '上海分拨中心/下车扫描 ',
                        'time': '2012-08-27 23:22:42',
                        'ftime': '2012-08-27 23:22:42',
                    }
                ]
            },
            states: [
                '在途', '揽收', '疑难', '签收', '退签', '派件', '退回', '转单', // 0-7
                '', '', // 8-9
                '待清关', '清关中', '已清关', '清关异常', '收件人拒签' // 10-14
            ]
        };
    },
    onLoad(res) {
        var param = { com: res.com, num: res.num };
        var sign = md5(JSON.stringify(param) + LOGISTICS_API.key + LOGISTICS_API.customer).toUpperCase();
        uni.request({
            url: LOGISTICS_API.url,
            method: LOGISTICS_API.method,
            header: {
                'Content-Type': LOGISTICS_API.content_type
            },
            data: {
                customer: LOGISTICS_API.customer,
                sign: sign,
                param: JSON.stringify(param)
            },
            success: function(res) {
                console.log(res);
                if (res.statusCode == 200) {
                    this.logistics = res.data;
                }
            }.bind(this)
        });
    },
    methods: {
        getDay: function(ftime) {
            if (ftime)
                return ftime.split(' ')[0];
            return '';
        },
        getTime: function(ftime) {
            if (ftime)
                return ftime.split(' ')[1];
            return '';
        },
        getNameFromCode: function(c) {
            return code.CODE2NAME[c];
        }
    }
};
</script>

<style>
</style>
